<template>
    <div>
       <home-header ></home-header> <!--:city="city"-->
       <home-swiper :swiper-list="swiperList"></home-swiper>
       <home-icons :icons-list="iconsList"></home-icons>
       <home-recommand :recommend-list="recommendList"></home-recommand>
       <home-weekend :weekend-list="weekendList"></home-weekend>
    </div>
</template>

<script>
//import HomeHeader from './components/Header.vue'
import HomeSwiper from './components/Swiper.vue'
import HomeIcons from './components/Icons.vue'
import HomeRecommand from './components/Recommand'
import HomeWeekend from './components/Weekend'
import axios from 'axios'
import { mapState } from 'vuex'

export default {
    name: 'Home',
    components: {
        //'home-header': HomeHeader,
         HomeHeader: () => import('./components/Header.vue'),//这是在组件里面实现按需加载的方式，
        'home-swiper': HomeSwiper,
        'home-icons': HomeIcons,
        'home-recommand': HomeRecommand,
        'home-weekend': HomeWeekend
    },
    computed: {
        ...mapState({
            curCity: 'city'
        })
    },
    data: function() {
       return {
            lastCity: '',
            swiperList: [],
            iconsList: [],
            recommendList: [],
            weekendList: [],
       }
    },
    methods: {
        getHomeInfo: function() {
            axios.get('/api/index.json?city=' + this.curCity)
                 .then(this.getHomeInfoSuccess);
        },

        getHomeInfoSuccess: function(res) {
            if (res.data.ret && res.data.data) {
                var data = res.data.data;
                //this.city = data.city;
                this.swiperList = data.swiperList;
                this.iconsList = data.iconsList;
                this.recommendList = data.recommendList;
                this.weekendList = data.weekendList;
            }
        }
    },
    mounted: function(){
        this.lastCity = this.curCity;
        this.getHomeInfo();
    },
    activated: function() {
        window.addEventListener('beforeunload', function() {
            window.scrollTo(0, 0);
        })

        if(this.lastCity !== this.curCity) {
            this.getHomeInfo();
            this.lastCity = this.curCity;
        }
    },
    deactivated: function() {
        
    }
}
</script>

<style>
  
</style>


